<template>
  <div>
    <van-cell
      :value="campus"
      is-link
      @click="campusPop = true"
      style="margin-bottom:12px;"
      v-if="roleType=='parent'"
    >
      <!-- 使用 title 插槽来自定义标题 -->
      <template slot="title">
        <span class="custom-title">学员姓名/校区</span>
        <span class="custom-title" style="color:red">*</span>
      </template>
    </van-cell>
    <van-cell :value="type" is-link @click="typePop = true">
      <!-- 使用 title 插槽来自定义标题 -->
      <template slot="title">
        <span class="custom-title">请假类型</span>
        <span class="custom-title" style="color:red">*</span>
      </template>
    </van-cell>
    <van-cell-group style="margin-top:12px;">
      <van-cell :value="sTime" is-link @click="stimePop = true">
        <template slot="title">
          <span class="custom-title">开始时间</span>
          <span class="custom-title" style="color:red">*</span>
        </template>
      </van-cell>
      <van-cell :value="eTime" is-link @click="etimePop = true">
        <template slot="title">
          <span class="custom-title">结束时间</span>
          <span class="custom-title" style="color:red">*</span>
        </template>
      </van-cell>
      <van-cell>
        <template slot="title">
          <span class="custom-title">请假时长</span>
          <span class="custom-title" style="color:red">*</span>
        </template>
        <template slot="right-icon">
          <span>{{time}}</span>
          <span style="color:rgba(16, 16, 16, 0.45)">天</span>
        </template>
      </van-cell>
    </van-cell-group>
    <van-field
      style="margin-top:12px;"
      v-model="message"
      rows="4"
      autosize
      label="请假原因"
      type="textarea"
      maxlength="50"
      placeholder="请输入请假原因"
      show-word-limit
    />
    <van-field name="uploader" label="图片说明" style="margin-top:12px;">
      <van-uploader v-model="uploader" slot="input" :after-read="afterRead" />
    </van-field>
    <div class="column-center" style="position:fixed;bottom:64px;width:100%;border-radius:8px;">
      <van-button
        style="border-radius:8px;width:90%;"
        color="#6CC9D2"
        size="large"
        @click="onSubmit"
      >确认提交</van-button>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: ""
    };
  }
};
</script>

<style>
</style>